<template>
  <el-form :model="searchData" :inline="true" class="search">
   <!-- <div>
      <el-form-item label="登录时间">
        <el-date-picker
          v-model="searchData.times"
          type="datetimerange"
          range-separator="-"
          start-placeholder="开始时间"
          end-placeholder="结束时间">
        </el-date-picker>
      </el-form-item>
    </div>
    <router-link to="/home/editUser">
      <el-button type="primary" class="create-user" v-auth="'USER_ADD'">添加用户</el-button>
    </router-link>
    <div>-->
      <!-- <el-form-item>
        <el-select v-model="searchData.access" placeholder="用户角色">
          <el-option label="用户角色" value="0"></el-option>
          <el-option label="超级管理员" value="1"></el-option>
        </el-select>
      </el-form-item> -->
      <el-form-item>
        <el-input placeholder="输入手机号/用户名" style="width: 500px" v-model="searchData.userId">
         <el-select v-model="searchData.select" style="width: 100px;" slot="prepend" placeholder="请选择">
            <el-option label="用户名" value="username"></el-option>
            <el-option label="电话" value="telephone"></el-option>
          </el-select>
          <el-button slot="append" @click="search" icon="el-icon-search">搜索</el-button>
        </el-input>
      </el-form-item>
      <el-button @click="seset">重置</el-button>
  <!--  </div>-->
  </el-form>
</template>


<script>
import Util from '@/common/util'
export default {
  computed: {
    createTimeEnd () {
      if (this.searchData.times.length) {
        return `${Util.formatDate(this.searchData.times[1])} ${Util.formatTime(new Date(this.searchData.times[1])).split(' ')[1]}`
      }
      return ''
    },
    createTimeStart () {
      if (this.searchData.times.length) {
        return `${Util.formatDate(this.searchData.times[0])} ${Util.formatTime(new Date(this.searchData.times[0])).split(' ')[1]}`
      }
      return ''
    }
  },
  data () {
    return {
      searchData: {
        userId: '',
        select: 'username',
        times: []
      }
    }
  },
  methods: {
    search () {
      const searchData = {}
      const select = this.searchData.select
      const detail = this.searchData.userId
      if (select === 'telephone') {
        const phoneReg = /^\d*$/
        if (!phoneReg.test(detail)) {
          this.$message.warning('请输入纯数字')
          return
        }
      }
      searchData[select] = detail
     // searchData.createTimeEnd = this.createTimeEnd
      //searchData.createTimeStart = this.createTimeStart
      this.$emit('search', searchData)
    },
    seset () {
      this.searchData = {}
      this.$emit('search', {})
    }
  }
}
</script>


<style scoped>
.search {
  padding: 16px 20px;
  background-color: #fff;
}
.create-user {
  float: right;
}
</style>
